import React, {Component} from 'react';

class Input extends Component {

  state = {
    content: ''
  }

  changeContent = (e) => {
    const value = e.target.value;
    if (value.length <= 100) {
      this.setState({
        content: value
      })
    }
  }

  onsubmit= () => {
    this.props.addComment(this.state.content)
    this.setState({
      content: ''
    })
  }

  render() {
    return (
      <div className="comm-input">
        <textarea
          placeholder="爱发评论的人，运气都很棒"
          value={this.state.content}
          onChange={this.changeContent}
        />
        <div className="foot">
          <div className="word">{this.state.content.length}/100</div>
          <div className="btn" onClick={this.onsubmit}>发表评论</div>
        </div>
      </div>
    );
  }
}

export default Input;
